import { useContext, useEffect, useState } from "react";
import ReduxContext from "./context";

export const connect = (mapStateToProps, mapDispatchToProps) => (Component) => {
  return function ConnectComponent(props) {
    const store = useContext(ReduxContext);
    const [, setBool] = useState(true);
    const forceUpdate = () => setBool((val) => !val);
    useEffect(() => {
      store.subscribe(forceUpdate);
    }, [store]);

    return (
      <Component
        {...props}
        {...mapStateToProps(store.getState())}
        {...mapDispatchToProps(store.dispatch)}
      />
    );
  };
};
